<template>
	<view class="content">
		<view class="center bold c007aff title">{{userinfo.name}}</view>
		<view class="widths acbox">
			<view class="flex item" @click="toReg">
				<view class="start pic">
					<view class="center img">
						<u-image src="../../static/company.png" width="48rpx" height="48rpx" mode="aspectFill" border-radius="16rpx"></u-image> 
					</view>
					<text class="ml-10">申請公司</text>
				</view>
				<u-icon name="arrow-right" color="#1296db" size="28"></u-icon>
			</view>
			<view class="flex item" @click="loginout">
				<view class="start pic">
					<view class="center img">
						<u-image src="../../static/loginout.png" width="48rpx" height="48rpx" mode="aspectFill" border-radius="16rpx"></u-image> 
					</view>
					<text class="ml-10">登出</text>
				</view>
				<u-icon name="arrow-right" color="#1296db" size="28"></u-icon>
				
			</view>
			<view class="flex item"  @click="chooseFile">
				<view class="start pic">
					<view class="center img">
						<u-image src="../../static/upload.png" width="70rpx" height="48rpx" mode="aspectFill" border-radius="16rpx"></u-image> 
					</view>
					<text class="ml-10">匯入</text>
				</view>
				<u-icon name="arrow-right" color="#1296db" size="28"></u-icon>
				
			</view>
		</view>
		<Tabar></Tabar>
		
		<u-popup v-model="regshow" mode="bottom" border-radius="16rpx"
		:safe-area-inset-bottom="true">
			<view class="widths regbox">
				<view class="list">
					<view class="flex item">
						<view class="center lebel">
							<u-icon name="grid" color="#d2e7ff" size="36"></u-icon>
							<text class="ml-10 c666">公司</text>
						</view>
						<view class="val">
							<u-input class="input" input-align="right" :show-confirmbar="false" v-model="regInfo.company" maxlength=100 type="text" placeholder="company" placeholder-style="color:#e0e0e0;font-size:24rpx;" />
						</view>
					</view>
				</view>
				<view class="center btnbox">
					<view class="center cfff btn" @click="subReg">提交</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import { mapState, mapMutations } from "vuex";
	import Tabar from "@/component/HomeTab"
	import { baseUrl } from "@/api/url.js"
	import { registerOtherCompany } from "@/api/apis.js"
	var passwordRegex = /^[a-zA-Z0-9_]{6,16}$/;
	export default {
		components:{
			Tabar
		},
		data() {
			return {
				regshow:false,
				regInfo:{
					company:"",
				},
				title:"專案列表",
				list:[],
				action: baseUrl+'/api/apict/uploadExcel',
				ident:0,
			}
		},
		onShow(){
			// const userAgent = navigator.userAgent.toLowerCase();
			// const mobileKeywords = ["iphone", "android", "windows phone"];
			// const isMobile = mobileKeywords.some(keyword => userAgent.includes(keyword));
			// if(!isMobile){
			// 		this.$Toast("请在移动端打开应用")
			// 		setTimeout(()=>{
			// 			this.$navi({
			// 			    route:{
			// 			        name:"Home",
			// 			    },
			// 			})
			// 		},1200)
			
			// }
			this.setTabList(uni.getStorageSync("bindevice"))
			this.$nextTick(()=>{
				if(uni.getStorageSync("islogin")){
					
					this.ident=parseInt(uni.getStorageSync("ident")) 
					if(uni.getStorageSync('name')){
						this.changeUserName(uni.getStorageSync('name'))
					}
				}
			})
		},
		onLoad() {

		},
		computed: {
			...mapState(["userinfo"]),
		},
		methods: {
			...mapMutations(['chageUserPageType','chageUserPageId','changeUserIdent','changeUserName','setTabList']),
			loginout(){
				uni.removeStorageSync("uid");
				uni.removeStorageSync("userToken");
				uni.removeStorageSync("ident")
				uni.removeStorageSync("islogin")
				uni.removeStorageSync("name")
				uni.removeStorageSync("tabIndex")
				uni.removeStorageSync('caseid')
				uni.removeStorageSync("fileDir")
				this.$Toast("退出成功")
				setTimeout(()=>{
					//跳轉到登錄頁
					this.$navi({
					    route:{
					        name:'Home',
					    },
					})
				},1200)
				
			},
			toReg(){
				this.regshow=true;
			},
			subReg(){
				if(!this.regInfo.company){
					this.$Toast("公司不能為空")
					return false;
				}
				let uid = uni.getStorageSync("uid");
				const data = {
					uid,
					company:this.regInfo.company
				}
				this.$Loading()
				registerOtherCompany(data).then((res)=>{
					uni.hideLoading()
					this.$Toast(res.msg)
				}).catch((err)=>{
					uni.hideLoading()
					if(err.code === 102){
						this.$ClearLogin(err.msg)
					}else{
						this.$Toast(err.msg)
					}
				}).finally(()=>{
					this.regshow=false;
				})
				
			},
			chooseFile() {
				// if(this.ident !== 1){
				// 	this.$Toast("無操作權限")
				// 	return
				// }
				uni.chooseFile({
					count:1,
					extension:['.xlsx,.xls'],
					success: (res) => {
						let filePaths = res.tempFilePaths[0];
						let uid = uni.getStorageSync("uid")
						this.$Loading("匯入中")
						uni.uploadFile({
							header:{
								'token':uni.getStorageSync('userToken')
								
							},
							url: this.action,
							filePath: filePaths,
							name: 'excelFile',
							formData:{
								uid,
								ident:this.ident
							},
							success: (res) => {
								uni.hideLoading()
								let data = JSON.parse(res.data);
								if(data.code===1){
									this.$Toast(data.msg)
								}else{
									if(data.code==101 || data.code==102){
										this.$ClearLogin('登录已过期')
									}else{
										this.$Toast(data.msg)
									}
									
								}
							},
							fail: (err) => {
								uni.hideLoading()
								let data = JSON.parse(err.data);
								this.$Toast(data.msg)
							}
						});
					}
				});
			},
		}
	}
</script>

<style lang="scss">
	.content{
		height: 100vh;
	}
	.title{
		padding: 60rpx 0;
	}
	.acbox{
		.item{
			padding: 16rpx 0;
			position: relative;
			padding-left: 18rpx;
			border-bottom: 2rpx solid #f1f8ff;
			.pic{
				align-items: center;
				.img{
					width: 70rpx;
				}
			}
		}
	}
	.regbox{
		padding: 30rpx 20rpx;
		border-radius: 16rpx 16rpx 0 0;
		.list{
			.item{
				width: 100%;
				padding: 4rpx 0;
				border-bottom: 2rpx solid #f9f9f9;
				.lebel{
					width: 120rpx;
					position: relative;
					// padding-left: 20rpx;
					// &::before{
					// 	content: "";
					// 	width: 8rpx;
					// 	height: 34rpx;
					// 	background-color: #007aff;
					// 	display: inline-block;
					// 	border-radius: 8rpx;
					// 	position: absolute;
					// 	left: 0;
					// 	top:2rpx;
					// 	box-shadow: 2rpx 2rpx 4rpx rgba(0, 0, 0, .15);
					// }
				}
				.val{
					width: calc(100% - 130rpx);
					margin-left: 10rpx;
				}
			}
		}
		.btnbox{
			padding: 120rpx 0 180rpx 0;
			.btn{
				background: linear-gradient(#007aff,#0e6ce1);
				width: 200rpx;
				height: 70rpx;
				border-radius: 10rpx;
			}
		}
		
	}
</style>
